<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../../include/taglib.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>

<html lang="zh-CN">
<head>
<%@include file="../../include/inhead.jsp"%>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">

<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet"
	href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<title>车辆保养--E爱车</title>

   
 <script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript">
       </script>
	<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
			<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
			<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->

<style>
body {
	color: #444;;
	background-color: #eee;
}

a {
	text-decoration: none
}

.navbar-eaiche {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
}

.tile {
	border: 1px solid #ccc;
	background-color: #fff;
	height: 150px;
	line-height: 150px;
	margin-top: 20px;
	text-align: center;
	padding: 0px;
	border-radius: 5px;
}

.tile img {
	width: 40%;
}
</style>
</head>
<body>
    
    <input type="hidden" id="city" value="${city }"/>
	<!-- 导航开始 -->
	<nav class="navbar navbar-eaiche">
		<div class="container">
			<div style="float: left;">
				<img style="height: 55px;" src="${ctx}/static/images/logoe.png" />
			</div>
			<div style="float: right; text-align: center; line-height: 50px;">
				<img style="height: 30px; margin-top: 0px;"
					src="${ctx}/static/images/local.png" />&nbsp;&nbsp;<span id="cspan">${city }</span>
			</div>
		</div>
	</nav>
	<!-- 导航结束 -->
	<!-- 广告开始 -->
	<div id="carousel-example-generic" class="carousel slide"
		data-ride="carousel">
		<!-- Indicators -->
		<ol class="carousel-indicators">
			<li data-target="#carousel-example-generic" data-slide-to="0"
				class="active"></li>
			<li data-target="#carousel-example-generic" data-slide-to="1"></li>
		</ol>
		<!-- Wrapper for slides -->
		<div class="carousel-inner" role="listbox">
			<div class="item active">
				<img src="${ctx}/static/images/01.jpg" alt="汽车">
				<div class="carousel-caption">汽车养护专家</div>
			</div>
			<div class="item">
				<img src="${ctx}/static/images/01.jpg" alt="汽车">
				<div class="carousel-caption">汽车养护专家</div>
			</div>
		</div>

		<!-- Controls -->
		<a class="left carousel-control" href="#carousel-example-generic"
			role="button" data-slide="prev"> <span
			class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span
			class="sr-only">上一个</span>
		</a> <a class="right carousel-control" href="#carousel-example-generic"
			role="button" data-slide="next"> <span
			class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
			<span class="sr-only">下一个</span>
		</a>
	</div>
	<!-- 广告结束 -->
	<!-- 功能块开始 -->
	<div class="container-fluid">
		<div class="row">
		   <c:forEach var="l" items="${list }" varStatus="ids">
		      <c:if test="${l.pathname=='机油三路' }">
		      <div class="col-xs-6 ">
				<a href="${ctx }/weixin/f/matenance/by/brand/service/${l.id}">
					<div class="tile">
						<span> <img src="${ctx}/static/images/jysl.png"> <span>${l.pathname }</span>
						</span>
					</div>
				</a>
			</div>
		      </c:if>
		      <c:if test="${l.pathname=='轮胎养护' }">
		       <div class="col-xs-6 ">
				<a href="${ctx }/weixin/f/matenance/by/brand/service/${l.id}">
					<div class="tile">
						<span> <img src="${ctx}/static/images/ltyh.png"> <span>${l.pathname }</span>
						</span>
					</div>
				</a>
			</div>
		      </c:if>
		      <c:if test="${l.pathname=='机油'}">
		        <div class="col-xs-6 ">
				<a href="${ctx }/weixin/f/matenance/by/brand/service/${l.id}">
					<div class="tile">
						<span> <img src="${ctx}/static/images/jysl.png"> <span>${l.pathname }</span>
						</span>
					</div>
				</a>
			</div>
		      </c:if>
		   </c:forEach>
			
	
		
		</div>
	</div>
	<!-- 功能块结束 -->
	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script
		src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
	<%@include file="../../include/iswechat.jsp" %>
		<script type="text/javascript">
	
		
		
		var city = $("#city").val();
		 if (window.navigator.geolocation) {
	         var options = {
	             enableHighAccuracy: true,
	         };		  
	    	  window.navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options);

	     } else {
	    	 if(city==""){
			   window.location.href="${ctx}/weixin/f/matenance/by/brand/citylist";
	    	 }
	     }
	 
			
	     function handleSuccess(position){
	         // 获取到当前位置经纬度  本例中是chrome浏览器取到的是google地图中的经纬度
	         var lng = position.coords.longitude;
	         var lat = position.coords.latitude;
	         document.cookie="latlng="+escape(lng+","+lat); 
		     alert(lng+"和"+lat);
	         // 调用百度地图api显示
	         var map = new BMap.Map("map");
	         var ggPoint = new BMap.Point(lng, lat);
			
	         console.log(ggPoint);
			
					var myGeo = new BMap.Geocoder();
					myGeo.getLocation(ggPoint, function(result) {
					     if(result){
							 console.log(result);

							 var components = result.addressComponents;
							
							 $.post("${ctx}/weixin/f/matenance/by/brand/setcity"
					    			 ,{
								           cityid:components.district,
								           citycheng: (components.province+components.city)
								     },function(data){
					    				 if(data.success){
					    					 $("#cspan").html(components.district);
					    				 }else{
					    					 alert("出现异常!请联系管理员");
					    				 }
					    			 },"json");

						 }else{
							 if(city==""){
							          window.location.href="${ctx}/weixin/f/matenance/by/brand/citylist";
							    }
						 }
					});
	  
	     }
	     


			
	     
	     function handleError(error){
	    	 if(city==""){
             window.location.href="${ctx}/weixin/f/matenance/by/brand/citylist";
	    	 }
	     }
	 </script>
		<script>
			var _hmt = _hmt || [];
			(function() {
			  var hm = document.createElement("script");
			  hm.src = "//hm.baidu.com/hm.js?3987c54e2c6d6c399fa4aca3fb9a7ef9";
			  var s = document.getElementsByTagName("script")[0]; 
			  s.parentNode.insertBefore(hm, s);
			})();
	</script>
	
</body>
</html>

